
<template>
    <!-- 面包屑 -->
    <el-breadcrumb separator="/" style="border-bottom: 1px solid #ccc;padding: 10px 0;margin-bottom:10px ;">
    <el-breadcrumb-item :to="{ path: '/index' }">首页</el-breadcrumb-item>
    <el-breadcrumb-item to="/oms/order"
      >订单</el-breadcrumb-item
    >
    <el-breadcrumb-item>退货原因详情</el-breadcrumb-item>
  </el-breadcrumb>

  <OmsReturnDetail :tableInfo="data.tableInfo"/>
  <div class="containt">
    <DetailInfo :info="data.info"/>
    <DetailAmount :amount="data.amount" :disabled="data.info.status===0?false:true"/>
    <div v-if="data.info.status!==0">
      <DetailSolve :solve="data.solve"/>
      <div v-if="isNULL(data.resolve)">
        <DetailResolve :resolve="data.resolve"/>
      </div>
    </div>
    <div v-else>
      <DetailNote lable="处理备注"/>
      <el-button type="primary">确认退货</el-button>
      <el-button type="danger">拒绝退货</el-button>
    </div>
  </div>
</template>
<script setup lang="ts">
import OmsReturnDetail from '@/components/c-oms/OmsReturnDetail.vue';
import DetailAmount from '@/components/c-oms/omsDetail/DetailAmount.vue';
import DetailInfo from '@/components/c-oms/omsDetail/DetailInfo.vue';
import DetailNote from '@/components/c-oms/omsDetail/DetailNote.vue';
import DetailResolve from '@/components/c-oms/omsDetail/DetailResolve.vue';
import DetailSolve from '@/components/c-oms/omsDetail/DetailSolve.vue';
import { Order } from '@/request/api';
import { Ref, reactive, ref } from 'vue';
import { useRoute } from 'vue-router';

let data = reactive<{
  amount:{
    productRealPrice:string;
    returnAmount:string;
    companyAddress:any;
    addresslist:Ref<[]>
  },
  [key:string]:any
}>({
  // 表格组件数据
  tableInfo:[],
  // 服务单信息
info : {},
// 金额
amount :{
  productRealPrice:"",
    returnAmount:"",
    companyAddress:{},
    addresslist:ref<[]>()
},
// 处理人员
solve : {},
// 收货人员
resolve : {}
})


let route = useRoute()
// 根据ID获取的详细订单信息
const getDetailAPI = function(){
  let actionForDetail = new Promise((re)=>{
    Order.OrderReturnDetailAPI(Number(route.query.id)).then(res=>{
      re(res)
    })
  })
  let actionForAddressList = new Promise((re)=>{
   Order.OrderCompanyAddressAPI().then(res=>{
    re(res)
   })
  })
  let result = Promise.all([actionForDetail,actionForAddressList])
  result.then((value:any[])=>{

  let {productPic,productBrand,productName,productRealPrice,productId,productAttr,productCount} = value[0]
  let {id,status,orderSn,orderId,createTime,memberUsername,returnName,returnPhone,reason,description,proofPics} = value[0]
  
  let {handleMan,handleTime,handleNote} = value[0]
  let {receiveMan,receiveTime,receiveNote} = value[0]

  data.tableInfo.push({productPic,productBrand,productName,productRealPrice,productId,productAttr,productCount})
  data.info = {id,status,orderSn,orderId,createTime,memberUsername,returnName,returnPhone,reason,description,proofPics}
  // data.amount = {productRealPrice:value[0].productRealPrice,returnAmount:value[0].returnAmount,companyAddress:value[0].companyAddress}
  data.solve = {handleMan,handleTime,handleNote}
  data.resolve = {receiveMan,receiveTime,receiveNote}
  
  // 发货地址匹配
  let addressListid = value[0].companyAddressId
    if(!value[0].companyAddressId){
      addressListid = 1
    }
  for(let item of value[1]){
    if(item.id===addressListid){
      return data.amount = {productRealPrice:value[0].productRealPrice,returnAmount:value[0].returnAmount || 0,companyAddress:item,addresslist:value[1]}
    }
  }
  }).catch(()=>{
    // console.log("error");
  })
  
}
// 判断对象属性是否为空
let isNULL = function(param:Object){
  for(let key in param){
    if(!param[key]){
      return false
    }
  }
  return true
}
// 创建时执行
getDetailAPI()
</script>
<style scoped>
.containt{
  width: calc(100% - 42px);
  padding: 20px;
  border: 1px solid #ccc;
  margin: 20px 0;
}
</style>